<template>
    <div>
        <SignInBox>
            <div class="not-my-bug">
                <div class="iconfont icon-app_logo logo"></div>
                <div class="app-name">{{ appName }}</div>
            </div>
        </SignInBox>
    </div>
</template>
<script lang='ts'>
import { computed, defineComponent } from 'vue'
import { homeStore } from '../store'
import SignInBox from '@/components/signInCom/signInBox.vue'
export default defineComponent({
    components: {
        SignInBox
    },
    name: "",
    setup() {
        const appName = computed(() => {
            return homeStore().APP_NAME
        })
        return {
            appName
        }
    },
})
</script>
<style lang="less" scoped>
.not-my-bug {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;

    .logo {
        font-size: 140px;
        width: 140px;
        height: 140px;
        line-height: 140px;
        color: @mainFontColor;
        font-weight: bold;
    }

    .app-name {
        font-size: 24px;
        font-weight: bold;
        letter-spacing: 2px;
        color: @mainFontColor;
        margin-top: 25px;
    }
}
</style>
